<template>
    <div id="brandStory">
      <ul>
        <li class="title">
          {{$t('brand.brandStory')}}
        </li>
      </ul>
      <ul v-for="(list,index) in brandStoryInfo" :key="index">
        <brand-story-content :info="list"/>
      </ul>
    </div>
</template>

<script>
    import brandStoryContent from '@/components/brand/brandStoryContent'
    export default {
        name: "brandStory",
      components: {
        brandStoryContent:brandStoryContent,
      },
      props:{
          brandStoryInfo:{},
      }
    }
</script>

<style scoped>
#brandStory{
  overflow: hidden;
  padding:7px 0;
}
  #brandStory ul{
    padding-left:10px;
    padding-right:10px;
    padding-bottom: 10px;
  }
  #brandStory ul:first-child{
    padding-top: 20px;
    padding-bottom: 5px;
  }
  .title{
    font-size:18px;
    font-weight: bold;
  }
</style>
